function initialize() {
	map = new google.maps.Map(document.getElementById("googlemap"), mapOptions);
	directionsDisplay.setPanel(document.getElementById("directionsPanel"));
	
	var autocomplete1 = new google.maps.places.Autocomplete(document.getElementById('txtLocation'));
	var autocomplete2 = new google.maps.places.Autocomplete(document.getElementById('txtstart'));
	var autocomplete3 = new google.maps.places.Autocomplete(document.getElementById('txtend'));
}

google.maps.event.addDomListener(window, 'load', initialize);


/*Google Maps*/
var map;
var mapOptions = {
   	center: new google.maps.LatLng(10.763897,106.6825),
    zoom: 16,
	
	mapTypeControl: true,
	mapTypeControlOptions: {
		style: google.maps.MapTypeControlStyle.HORIZONTAL_BAR,
		position: google.maps.ControlPosition.BOTTOM_CENTER
	},
	
	panControl: true,
	panControlOptions: {
		position: google.maps.ControlPosition.LEFT_CENTER
	},
	
	zoomControl: true,
	zoomControlOptions: {
		style: google.maps.ZoomControlStyle.LARGE,
		position: google.maps.ControlPosition.LEFT_CENTER
	},
	
	scaleControl: true,
	scaleControlOptions: {
		position: google.maps.ControlPosition.LEFT_CENTER
	},
	
	streetViewControl: false,
};

/*Location*/
var geocoder = new google.maps.Geocoder();
var marker = new google.maps.Marker();

function codeAddress() {
	clear();
    var address = document.getElementById("txtLocation").value;
    geocoder.geocode( { 'address': address}, function(results, status) {
   		if (status == google.maps.GeocoderStatus.OK) {
        	map.setCenter(results[0].geometry.location);
			map.setZoom(16);
			marker.setPosition(results[0].geometry.location);
			marker.setMap(map);
      	} else {
        	alert("Geocode was not successful for the following reason: " + status);
      	}
    });
}



/*Direction*/
var directionsDisplay = new google.maps.DirectionsRenderer();
var directionsService = new google.maps.DirectionsService();

function calcRoute() {
	clear();
  	var start = document.getElementById("txtstart").value;
  	var end = document.getElementById("txtend").value;
  	var request = {
    	origin:start,
    	destination:end,
    	travelMode: google.maps.TravelMode.DRIVING
  	};
	
  	directionsService.route(request, function(result, status) {
    	if (status == google.maps.DirectionsStatus.OK) {
			directionsDisplay.setMap(map);
      		directionsDisplay.setDirections(result);
    	}
  	});
}

/*Clear Maps*/
function clear(){
	marker.setMap(null);
	directionsDisplay.setMap(null);
	document.getElementById("directionsPanel").innerHTML = "";
}

